<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    div{
        width: 600px;
        height: 40px;
        border: 1px solid #666666;
        text-align: center;
        line-height: 40px;
        margin: 10px auto;
    }
    span{
        font-size: 12px;
        font-family: '微软雅黑';
        background-color: gold;

        height: 26px;
        padding: 5px;
        
    }
    .dian{
        background: white;
    }
    a{
        text-decoration: none;
        color: black;
    }
</style>
<body>
    <div>
        <span><a href="javaScipt:;">上一页</a></span>
        <span> <a href="javaScipt:;">1</a></span>
        <span><a href="javaScipt:;">2</a></span>
        <span><a href="javaScipt:;">3</a></span>
        <span><a href="javaScipt:;">4</a></span>
        <span class="dian">...</span>
        <span><a href="javaScipt:;">17</a></span>
        <span><a href="javaScipt:;">18</a></span>
        <span><a href="javaScipt:;">19</a></span>
        <span><a href="javaScipt:;">20</a></span>
        <span><a href="javaScipt:;">下一页</a></span>
    </div>
</body>
</html>